<template>
  <view class="bar"></view>

  <view>
    <goodsItem v-for="(item,index) in goodsList" :item="item" :key="item.id"></goodsItem>
    <u-divider
        v-if="!isData"
        text="没有更多数据了~"
    ></u-divider>
  </view>
</template>

<script setup lang="ts">
import {onMounted, ref} from "vue";
import {reqGoodsList} from "@/api/goods";
import {onLoad, onReachBottom} from "@dcloudio/uni-app";

const info = ref({
  page: 1,
  limit: 10,
  categoryId: '',
})

onLoad(async (options: any) => {
  uni.setNavigationBarTitle({
    title: options.title
  })
  info.value.categoryId = options.id
  await getGoodsList();
})

const goodsList = ref<any>([])

async function getGoodsList() {
  await reqGoodsList(info.value).then((res: any) => {
    if (res.code == 200) {
      if (res.data.length > 0) {
        goodsList.value.push(...res.data)
      } else {
        isData.value = false
      }
    }
  })
}

onReachBottom(async () => {
  if (isData.value) {
    info.value.page++
    await getGoodsList();
  }
})

const isData = ref(true)
</script>


<style scoped lang="scss">

</style>
